<template>
	<div class="admin">
		<list class="message_item_content">
			<noDate v-if="admins.length==0"></noDate>
			<cell v-for="item in admins">
				<div class="message_item">
					<div class="message_time"><text>20:31</text></div>
					<div class="message_box">
						<div class="box_head">
							<div class="box_head_tittle"><text class="head_tittle">您的账号密码已修改</text>
								<div class="circular"></div>
							</div>
						</div>
						<div class="box_body"><text class="box_body_text">您的账号密码已于2019年8月10日21:19，如果非本人操作，请及时修改密码。</text></div>
					</div>
				</div>
			</cell>
		</list>
	</div>

</template>
<script>
	const eeui = app.requireModule('eeui');
	import {
		list,
		markAsRead,
		unReadCount,
		update
	} from "../../../../api/msgPush"
	import noDate from '../../../../components/noData/noData.vue'
	export default {
		name: 'admin',
		data() {
			return {
				pageSize:10,
				msgKey: 'msg-notify',
				admins: []
			}
		},
		created() { // 在实例创建完成后被立即调用
		this.loadMsgList()
		},
		methods: {
			loadMsgList() {
				list({
					pageSize:this.pageSize,
					msgKey: this.msgKey,
					mchId: this.getGlobalData().mchId
				}).then(res => {
					res.data.data.forEach(item => {
						item.msgContent = JSON.parse(item.msgContent).itemList
					})
					this.admins = res.data.data


					markAsRead({
						msgKey: this.msgKey,
					}).then(res => {})
				})
			},
		},
		components: {noDate},
	}
</script>

<style scoped>
	/* pages/message/admin/admin.wxss */
	.admin {
		background-color: rgb(248, 248, 248);
	}

	.message_content {
		display: flex;
		margin-top: 20px;
		padding-right: 30px;
		padding-left: 30px;
		flex-direction: column;

	}

	.message_head {
		margin-left: 5px;
		width: 682px;
		flex-direction: row;
		display: flex;
		justify-content: space-between;
	}

	.message_tittle {
		height: 33prx;
		font-size: 34px;
		font-weight: 500;
		color: rgba(26, 26, 30, 1);
		margin-left: 95px;
	}

	.message_all {
		height: 28px;
		font-size: 30px;
		font-weight: 400;
		color: rgba(26, 26, 30, 1);
	}

	.message_item_content {
		display: flex;
		flex-direction: column;
		padding-left: 24px;
		padding-right: 24px;
		padding-top: 38px;
	}

	.message_time {
		text-align: center;
		font-size: 24px;
		font-weight: 400;
		color: rgba(26, 26, 30, 1);
		opacity: 0.3;
	}

	.message_box {
		width: 702px;
		background-color: rgba(255, 255, 255, 1);
		border-radius: 16px;
		display: flex;
		flex-direction: column;
		margin-top: 38px;
		margin-bottom: 38px;
	}

	.box_head_tittle {
		display: flex;
		flex-direction: row;
		margin-left: 25px;
		margin-top: 31px;
		align-items: center;
		justify-content: center;
	}

	.head_tittle {
		font-size: 28px;
		font-weight: 400;
		color: rgba(26, 26, 30, 1);
		line-height: 36px;
	}

	.circular {
		width: 10px;
		height: 10px;
		background: rgba(231, 91, 83, 1);
		border: 2px solid rgba(231, 91, 83, 1);
		border-radius: 50%;
		margin-left: 16px;
	}

	.box_head {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-end;
	}


	.box_body {
		width: 645px;
		margin-left: 25px;
		margin-top: 47px;
		margin-bottom: 29px;
	}

	.box_body_text {
		font-size: 24px;
		font-weight: 400;
		color: rgba(26, 26, 30, 1);
		line-height: 36px;
		opacity: 0.5;
	}
</style>
